import { useState } from 'react'
import logo from './logo.svg'
import './App.css'
import _ from 'lodash'

function App() {
  const [value,setValue]=useState('')
  let currentValue=''
  const handleChange=(e)=>{
    currentValue=e.target.value;
    setValue(currentValue)
    console.log(value)
  }
  return (
    <div className='container'>
      <input type="text" onChange={_.debounce(handleChange,300)}/>
      <div>{value}</div>
      <div className='list'>
        {
          Array(100)
          .fill('a')
          .map((item,index)=>
            <div key={index}>{value}</div>
          )
        }
      </div>
    </div>
  )
}

export default App
